{% extends 'base.html' %}
{% block title %}
    详情
{% endblock %}
{% block head %}
    <link rel="stylesheet" href="{{ url_for('static',filename='css/detail.css') }}">
    <script type="text/javascript" src="{{ url_for('static',filename='showdown-master/dist/showdown.min.js') }}"></script>

{% endblock %}
{% block main %}
    <h3 class="page-title">{{ question.title }}</h3>
    <p class="question-info">
        <span class="question-author">作者: <a href="{{ url_for('personal_homepage',user_id=question.author_id) }}">{{ question.author.username }}</a></span>
        <span>时间: {{ question.create_time }}</span>
    </p>

    <hr>
    <div id="{{ question.id }}ll" class="question-content"></div>
    {% if user_id == question.author.id %}
        <div class="btn btn-primary">
            <a href="{{ url_for('modification',question_pre_id = question.id) }}">编辑</a>
        </div>
    {% endif %}

    <textarea style="visibility: hidden;" id="{{ question.id }}zz">{{ question.content }}</textarea>
     <script type="text/javascript">

                        {#var text = "{{ question.content }}"#}
                        var text = document.getElementById("{{ question.id }}zz").value;
                        {#console.log(typeof(text));#}
                        var converter = new showdown.Converter();
                        var html = converter.makeHtml(text);
                        document.getElementById("{{ question.id }}ll").innerHTML = html;

                    </script>
    <hr>
    <h4>评论 (0)</h4>
    <form action="{{ url_for('add_comment') }}" method="post">
    <div style="width: 60%;">
        <div class="form-group" style="width: 100%;">
            <input name="comment_content" type="text" class="form-control" placeholder="填写你的评论">
            <input type="hidden" name="question_id" value="{{ question.id }}">
        </div>
        <div class="form-group" style="text-align: right">
            <button class="btn btn-primary">立即评论</button>
        </div>
    </div>
    </form>
    <br>
    <ul class="comment-list">
        {% for comment in question.comments %}
            <li>
                <div class="user_info">
                    <img class="avatar" src="{{ url_for('static',filename='images/google_din1.png') }}" alt="">
                    <span class="username">
                        <a href="{{ url_for('personal_homepage',user_id=comment.author_id) }}">{{ comment.author.username }}</a>

                        <div id="master-identification">{% if  question.author_id == comment.author_id %}
                            &nbsp;&nbsp;master
                        {% endif %}</div>
                    </span>
                    <span class="create-time">{{ comment.create_time }}</span>
                </div>
                <p class="comment-content">{{ comment.content }}</p>
            </li>
        {% endfor %}
        
    </ul>
{% endblock %}
